import 'package:flutter/material.dart';
import 'package:flutter_html/flutter_html.dart';
import 'package:flutter_html/style.dart';
import 'package:tender_flutter/constant/app_constant.dart';
import 'package:tender_flutter/constant/theme_colors.dart';
import 'package:tender_flutter/http/api_response.dart';
import 'package:tender_flutter/page/home/api/api_home.dart';
import 'package:tender_flutter/page/home/model/article_detail_entity.dart';
import 'package:tender_flutter/style/font_style.dart';
import 'package:tender_flutter/utils/screen_adaper.dart';
import 'package:tender_flutter/widgets/base_appbar.dart';
import 'package:tender_flutter/widgets/load_state_layout.dart';

class ArticleDetailPage extends StatefulWidget {
  /// 文章id
  final int articleId;

  const ArticleDetailPage({Key key, this.articleId}) : super(key: key);

  @override
  _ArticleDetailPageState createState() => _ArticleDetailPageState();
}

class _ArticleDetailPageState extends State<ArticleDetailPage> {
  LoadState _loadState = LoadState.State_Loading;

  /// 资讯讯详情
  ArticleDetailEntity _detailEntity;

  /// 获取数据
  Future<ApiResponse<ArticleDetailEntity>> _getDetail() async {
    await Future.delayed(Duration(milliseconds: 400), () async {});
    return await ApiHome.getArticleDetail<ArticleDetailEntity>(
        id: widget.articleId);
  }

  FutureBuilder<ApiResponse<ArticleDetailEntity>> _buildFutureBuilder() {
    return FutureBuilder(
        future: _getDetail(),
        builder: (BuildContext context,
            AsyncSnapshot<ApiResponse<ArticleDetailEntity>> snapshot) {
          if (snapshot.hasData) {
            _detailEntity = snapshot.data.result;
            _loadState = LoadState.State_Success;
            return LoadStateLayout(
              bgColor: ThemeColors.colorWhite,
              state: _loadState,
              successWidget: _initBody(),
            );
          } else {
            return LoadStateLayout(
              bgColor: ThemeColors.colorWhite,
              state: _loadState,
            );
          }
        });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: ThemeColors.colorWhite,
      appBar: _initAppBar(),
      body: _buildFutureBuilder(),
    );
  }

  /// 导航
  Widget _initAppBar() {
    return BaseAppBar(context, Text("资讯详情", style: FonStyle.navTextStyle()));
  }

  /// 内容体
  Widget _initBody() {
    return SingleChildScrollView(
        physics: BouncingScrollPhysics(),
        child: Column(children: [_initTitleLayout(), _initContent()]));
  }

  /// 标题视图
  Widget _initTitleLayout() {
    return Container(
        padding: EdgeInsets.all(ScreenAdapter.width(30)),
        width: double.infinity,
        child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
          Text(_detailEntity.title,
              maxLines: 2,
              style: TextStyle(
                  color: ThemeColors.colorType1,
                  fontSize: ScreenAdapter.sp(36),
                  fontWeight: FontWeight.bold)),
          SizedBox(height: ScreenAdapter.height(30)),
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Text(
                _detailEntity.type == AppConstant.ARTICLE_TYPE_DYNAMIC
                    ? "权鸟动态"
                    : "行业前沿",
                style: TextStyle(
                  color: ThemeColors.colorType6,
                  fontSize: ScreenAdapter.sp(27),
                ),
              ),
              Text(
                _detailEntity.createDate,
                style: TextStyle(
                  color: ThemeColors.colorType14,
                  fontSize: ScreenAdapter.sp(26),
                ),
              ),
              Text(
                "${_detailEntity.views}人看过",
                style: TextStyle(
                  color: ThemeColors.colorType14,
                  fontSize: ScreenAdapter.sp(26),
                ),
              ),
            ],
          ),
        ]));
  }

  /// 资讯内容
  Widget _initContent() {
    return Container(
      margin: EdgeInsets.all(ScreenAdapter.width(20)),
      child: Html(
        shrinkWrap: true,
        data: _detailEntity.content ?? "",
        style: {
          "html": Style(
              backgroundColor: Colors.white,
              fontSize: FontSize(ScreenAdapter.sp(32))
//              color: Colors.white,
              ),
        },
        onLinkTap: (url) {
          // open url in a webview
          // ToastUtils.show("点击了链接$url");
        },
        onImageTap: (src) {
          // Display the image in large form.
        },
      ),
    );
  }
}
